<!-- Student_trainFreeCourseTab.html -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>自由课程章节列表</title>
		<link rel="stylesheet" type="text/css" href="../../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../../css/base.css"/>
		<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
		<style type="text/css" media="screen">
			.nav-right-img{
				width: 24px;
				margin-left: 12px;
				margin-top: 8px;
			}
			.redPointMessage{
				width: 8px;
				height: 8px;
				top: 4px;
				left: 30px;
				right: 0px;
			}
			.tabbar {
				height: 40px;
				line-height: 40px;
				text-align: center;
				/*border-bottom: 1px solid #e0e0e0;*/
				background: #fff;
			}
			.tabbar .col {
				font-size: 16px;
			}
			.row {
				display: -webkit-box;
				display: -webkit-flex;
				display: flex;
			}
			.col {
				-webkit-box-flex: 1;
				-webkit-flex: 1;
				flex: 1;
				position: relative;
				overflow: hidden;
			}
			.indicator-super-div{
				width: 100%;
				height: 2px;
				padding: 0 20%;
				overflow: hidden;
			}
			.indicator {
				height: 2px;
				width: 62%;
				background: #18b4ed;
				position: absolute;
				bottom: 0;
				z-index: 2;
			}
			.weui_tabbar {
				width: 100%;
				position: fixed;
				left: 0;
				bottom: 0;
			}
		</style>
	</head>
	<body>
		<div class="base_style_color " id='BarAppearance' style="height: 22px;width: 100%"></div>
		<div class="base_navigation_bar base_style_color">
			<a class="base_left_item" href="#" onclick="backClick()"> <img class="base_back_icon" src="../../image/icon_jiantou.png" alt=""> </a>
			<span id="title_id">课程章节</span>
		</div>
		<!-- <div class="base_content_div">
			<div class="bgwhite mui-table-view" style="padding: 0 44px;">
				<div id="selectBar" class="row hightitem tabbar" >
					<div class="col base_dark_grey base_content_font" id="col1" tapmode onclick="tabswitch(1)">
						章节
						<div class="indicator-super-div">
							<div class="indicator" id="indicator1"></div>
						</div>
					</div>
					<div class="col base_dark_grey base_content_font"  id="col2" tapmode onclick="tabswitch(2)">
						<span id="question_tag">
							提问
						</span>
						<div class="indicator-super-div">
							<div class="indicator" id="indicator2"></div>
						</div>
					</div>
					<div class="col base_dark_grey base_content_font" id="col3" tapmode onclick="tabswitch(3)">
							笔记
						<div class="indicator-super-div">
							<div class="indicator" id="indicator3"></div>
						</div>
					</div>
				</div>
			</div>
		</div> -->
	</body>
	<script src="../../script/jquery.min.js" type="text/javascript"></script>
	<script src="../../script/api.js" type="text/javascript"></script>
	<script src="../../script/common.js"></script>
	<script src="../../script/push.js"></script>
	<script src="../../script/requestTool.js"></script>
	<script type="text/javascript">
		apiready = function() {
		  	$('#title_id').html(api.pageParam.title);
			// setupFreeCourseFrameGroup();
			setupFreeCourseFrame();
			setupNotifi();

            api.sendEvent({
                name: 'click_pushMessage_index'
            });
            pushMessage();
            api.addEventListener({
                name: 'pushMessage'
            }, function(ret, err) {
                pushMessage();
            });
            // updateMessageStatusFromChapterOrDiscuss(api.pageParam.courseid, 0);
		}
		function setupFreeCourseFrame(){
			var y = $('#BarAppearance').height() + $('.base_navigation_bar').height();
			var h = api.winHeight - y;
			var rect = {
				x : 0,
				y : y,
				w : 'auto',
				h : 'auto'
			}
			api.openFrame({
			    name : 'Student_FreeCourseChapterListNew',
				url : 'Student_TempFreeCourseChapterList.html',
				pageParam : api.pageParam,
			    rect: rect,
			    bounces: false
			});
		}
		function setupNotifi(){
			api.addEventListener({
			    name: 'keyback'
			}, function(ret, err) {
			    backClick();
			});
		}
		function setupFreeCourseFrameGroup() {
			var y = $('#BarAppearance').height() + $('.base_navigation_bar').height() + $('.base_content_div').height();
			var h = api.winHeight - y;
			var rect = {
				x : 0,
				y : y,
				w : 'auto',
				h : h
			}
			var questionParams = api.pageParam;
			questionParams['coursename'] = api.pageParam.title;
			var frames = new Array();
			frames.push({//添加章节列表
				name : 'Student_FreeCourseChapterListNew',
				url : 'Student_TempFreeCourseChapterList.html',
				pageParam : api.pageParam
			});
			frames.push({//添加提问
		        name: 'Teacher_StudyCourseQA', 
		        url: '../Teacher_Teach/Teacher_StudyCourseQA.html',
		        pageParam: questionParams
		    });
		    frames.push({
		        name: 'Teacher_StudyCourseNote', 
		        url: '../Teacher_Teach/Teacher_StudyCourseNote.html',
		        pageParam: questionParams
		    });
			api.openFrameGroup({
				name : 'freeCourseGroup',
				rect : rect,
				scrollEnabled : false,
				frames : frames
			}, function(ret, err) {
			});
			tabswitch(1);
		}
		function itemClick(itemIndex) {
			if (!$('#item' + itemIndex).hasClass('mui-active')) {
				$('.segment_item').removeClass('mui-active');
				$('#item' + itemIndex).addClass('mui-active');
				setupGroupIndex(itemIndex);
			}
		}
		function sendBuriedNotifi(busionessid,pagetype,pagetypeid){
		    var userinfo = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				uname : $api.getStorage('cfnetppusername')
			}
			var data = {
				busionessid : busionessid,
				pagetype : pagetype,
				pagetypeid : pagetypeid,
				sourceurl : api.pageParam.sourceurl,
				sourcetitle : api.pageParam.sourcetitle,
				accesspageurl :  window.location.pathname,
				accesspagetitle : document.title,
				userinfo : userinfo
			}
			SendBehaviorTrajectoriesNotifi_Study(data);
		}
		function tabswitch(index){
			if(index == 1){
				sendBuriedNotifi('0', '章节列表', '028');
			}else if(index == 2){
				sendBuriedNotifi('0', '课程提问列表', '018');
			}else if(index == 3){
				sendBuriedNotifi('0', '笔记列表', '023');
			}
			$('.indicator').attr('style','display:none;');
			$('.col').attr('style', 'color:#323232;');
			$('#col'+index).attr('style','color:#18b4ed;');
			$('#indicator'+index).attr('style','display:block;');
			setupGroupIndex(index-1);
		} 
		function setupGroupIndex(index) {
			api.setFrameGroupIndex({
				name : 'freeCourseGroup',
				index : index,
				scroll : false
			});
		}
		function backClick(){
			//刷新课程列表
		    api.sendEvent({
		        name: 'freeCourseScheduleNofiti',
		        extra: {
		            courseid: api.pageParam.courseid,
		            planid: api.pageParam.planid
		        }
		    });
		    sendBuriedNotifi(1, '章节列表', '028');
		    api.closeWin();   
		}
        //push 消息提醒
        function pushMessage() {
            var jid = $api.getStorage('cfnetppjxid');
            var msgVal = $api.getStorage('cfnetppmessagexuexi' +　jid  + "massage" +  api.pageParam.courseid);
            consoleTest("msgVal cid : " + msgVal);
            if (msgVal == 1) {
                $('#redPointMessage').show();
            }else{
                $('#redPointMessage').hide();
            }
        }
		//跳转消息页面
        function toMessageClick(){
            api.openWin({useWKWebView:true,
                name: 'Student_MessageWin',
                url: 'Student_MessageWin.html',
                pageParam : {
                    cid : api.pageParam.courseid,
					sourceurl : window.location.pathname,
		            sourcetitle : document.title,
		            pid : api.pageParam.planid,
                }
            });
            sendBuriedNotifi(1, '章节列表', '028');
        }
	</script>
</html>